<!DOCTYPE HTML>
<html>
    <head>
        <meta charset="utf-8" />
        <title>评价商品-{eyou:global name='web_name' /}</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
        <link href="{eyou:global name='web_cmspath'/}/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        {eyou:static file="users/skin/css/bootstrap.min.css"/}
        {eyou:static file="users/skin/css/basic.css"/}
        {eyou:static file="users/skin/css/eyoucms.css"/}
        {eyou:static file="users/skin/css/shop.css"/}
        {eyou:static  file="users/skin/css/tb_style.css"/}
        <!-- 新样式 2020-11-25 -->
        {eyou:static file="users/skin/css/element/index.css" /}
        {eyou:static file="users/skin/css/e-user.css" /}
        {eyou:include file="users/skin/css/diy_css.htm"/}

        {eyou:static file="/public/static/common/js/jquery.min.js"/}
        {eyou:static file="/public/plugins/layer-v3.1.0/layer.js"/}
        {eyou:static file="/public/static/common/js/tag_global.js"/}
        <script type="text/javascript" src="__STATIC__/admin/js/jquery-ui/jquery-ui.min.js"></script>
    </head>

    <body>

    <!-- 头部 --> 
    {eyou:include file="users/users_header.htm" /} 
    <!-- 头部结束 -->

    <div class="ey-body-bg">
        <div class="ey-body">
            <div class="ey-container w1200">
                <!-- 侧边 --> 
                {eyou:include file="users/users_left.htm" /} 
                <!-- 侧边结束 --> 
                <!-- 中部 -->
                <div class="ey-con fr" >
                    <div class="el-main main-bg">
                        <div class="column-title mb20"> <div class="column-name">评价商品</div> </div>
                        <form id="post_form">
                            <input type="hidden" name="order_id" value="{$eyou.field.order_id}" />
                            <input type="hidden" name="order_code" value="{$eyou.field.order_code}" />
                            <input type="hidden" name="details_id" value="{$eyou.field.details_id}" />
                            <input type="hidden" name="product_id" value="{$eyou.field.product_id}" />

                            <div class="order-progress">
                                <!-- 订单信息 -- 开始 -->
                                <div class="order-progress-tit2"> <div class="order-progress-titL">订单信息</div> </div>
                                <div class="order-progress-con">
                                    <div class="el-row shop-car">
                                        <div class="el-table el-table--fit el-table--enable-row-hover el-table--enable-row-transition" style="width: 100%; border-bottom: 1px solid #eee;">
                                            <table>
                                                <thead>
                                                    <tr>
                                                        <th style="width: 250px;"><div class="cell">订单编号</div></th>
                                                        <th style="width: 490px;"><div class="cell">商品名称</div></th>
                                                        <th style="width: 140px;"><div class="cell tc">单价</div></th>
                                                        <th style="width: 60px;"><div class="cell tc">数量</div></th>
                                                    </tr>
                                                </thead>
                                            
                                                <tbody>
                                                    <tr>
                                                        <td><div class="cell">{$eyou.field.order_code}</div></td>
                                                        <td>
                                                            <div class="cell">
                                                                <div class="goods-item">
                                                                    <div class="goods-item-l fl">
                                                                        <a target="_blank" href="{$eyou.field.arcurl}" title="{$eyou.field.product_name}"><img class="img-responsive" src="{$eyou.field.litpic}" alt="商品图"></a>
                                                                    </div>
                                                                    <div class="goods-item-r fl">
                                                                        <div class="cell">
                                                                            <a target="_blank" href="{$eyou.field.arcurl}" class="fc3">{$eyou.field.product_name}</a>
                                                                            <div class="info mt5">{$eyou.field.spec_value}</div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </td>
                                                        <td><div class="cell tc">{$eyou.field.product_price}</div></td>
                                                        <td><div class="cell tc">{$eyou.field.num}</div></td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                    </div>  
                                </div>
                                <!-- 订单信息 -- 结束 -->

                                <div class="order-progress-tit2"> <div class="order-progress-titL">评价信息</div> </div>
                                <div class="order-progress-con">
                                    <div class="item-from-row">
                                        <div class="from-row-l" style="width: 9%;"> <span class="red">*</span> 评价评分：</div>
                                        <div class="from-row-r">
                                            <label class="radio-label">
                                                <span>好评</span>
                                                <input type="radio" class="radio" name="total_score" value="1" checked>
                                                <span class="check-mark"></span>
                                            </label>
                                            <label class="radio-label">
                                                <span>中评</span>
                                                <input type="radio" class="radio" name="total_score" value="2">
                                                <span class="check-mark"></span>
                                            </label>
                                            <label class="radio-label">
                                                <span>差评</span>
                                                <input type="radio" class="radio" name="total_score" value="3">
                                                <span class="check-mark"></span>
                                            </label>
                                        </div>
                                    </div>

                                    <div class="item-from-row">
                                        <div class="from-row-l" style="width: 9%;"> 评价内容：</div>
                                        <div class="from-row-r">
                                            <textarea rows="5" cols="60" name="content" class="fs16" maxlength="400" onkeyup="setval(this, '400')" id="comment_content" placeholder="商品是否给力？快分享你的购买心得吧~"></textarea>
                                            <b id="CommentContentWordCount">400</b> / 400
                                        </div>
                                    </div>

                                    <div class="item-from-row" id="dl_upload_img" data-numlimit="6">
                                        <div class="from-row-l" style="width: 9%;"> 评价晒单：</div>
                                        <div class="from-row-r">
                                            <div class="from-row-r" style="width: 100%;">
                                                <div class="images_upload_main">
                                                    <a href="javascript:void(0);" onclick="GetUploadify(6, '', 'allimg', 'UploadImgCallBack', '', '评价晒单');" class="el-button el-button--primary is-plain el-button--small"><i class="el-icon-picture"></i>上传图片</a>
                                                    <span style="color: #b7aeae;">提示：最多可上传6张图片，超过则不显示</span>
                                                    <div class="sort-list mt20 ui-sortable">
                                                        <div class="fieldext_upload ui-sortable-handle" style="display: none;"></div>
                                                    </div>
                                                </div>

                                                <!-- 上传图片显示的样板 start -->
                                                <div class="upload_img_upload_tpl" style="display: none;">
                                                    <div class="fieldext_upload">
                                                        <div class="images_upload_item" style="width: 105px; height: 105px;">
                                                            <input type="hidden" name="upload_img[]">
                                                            <a href="javascript:void(0);">
                                                                <img src="" style="width: 105px; height: 105px;">
                                                            </a>
                                                            <a class="delete" href="javascript:void(0)">&nbsp;&nbsp;</a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <!-- 上传图片显示的样板 end -->
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="order-progress-tit2"> <div class="order-progress-titL">提交评价</div> </div>
                                <div class="order-progress-con">
                                    <input type="button" onclick="SubmitData(this);" data-url="{$eyou.SubmitUrl}" class="el-button el-button--primary " value="确认提交"/>
                                </div>
                            </div>
                        </form>
                    </div>   
                </div>
                <!-- 中部结束 --> 
            </div>
        </div>
    </div>
<script type="text/javascript">
    // 判断内容填写和评分
    function setval(obj, sum) {
        var len = $(obj).val().length;
        var textarea = $('#CommentContentWordCount');
        if(len > sum) {
            $(obj).val($(obj).val().substring(0,sum));  //截取规定长度字符串
        }
        var num = sum - len;
        num <= 0 ? textarea.text(0): textarea.text(num);  //防止出现负数
    }

    // 上传多图回调函数
    function UploadImgCallBack(paths) {
        var last_div = $(".upload_img_upload_tpl").html();
        var obj = $('#dl_upload_img');
        for (var i = 0; i < paths.length; i++) {
            // 若可上传数量为0则执行返回
            var num = obj.attr('data-numlimit');
            if (0 == num) return false;
            num = Number(num) - 1;
            obj.attr('data-numlimit', num);

            // 拼装图片
            obj.find(".fieldext_upload:eq(0)").before(last_div);
            obj.find(".fieldext_upload:eq(0)").find('input').val(paths[i]);
            obj.find(".fieldext_upload:eq(0)").find('a:eq(0)').attr('href', paths[i]).attr('target', "_blank");
            obj.find(".fieldext_upload:eq(0)").find('img').attr('src', paths[i]);
            obj.find(".fieldext_upload:eq(0)").find('a:eq(1)').attr('onclick',"UploadImgDel(this, '"+paths[i]+"')").text('');
        }             
    }

    // 上传之后删除组图input
    function UploadImgDel(obj, path) {
        $(obj).parent().remove();
        $.ajax({
            type:'POST',
            url:"{:url('user/Uploadify/delupload', ['_ajax'=>1])}",
            data:{action:"del", filename:path},
            success:function(){
                var img_obj = $('#dl_upload_img');
                var num = img_obj.attr('data-numlimit');
                num = Number(num) + 1;
                img_obj.attr('data-numlimit', num);
            }
        });  
    }

    /** 以下 图集相册的拖动排序相关 js*/
    $( ".sort-list" ).sortable({
        start: function( event, ui) {},
        stop: function( event, ui ) {}
    });
    $( ".sort-list" ).disableSelection();

    // 提交申请
    function SubmitData(obj) {
        if ($("#total_score").val()=='') {
            layer.msg('请选择评价评分！');
            return false;
        }

        layer_loading('正在处理');
        $.ajax({
            url: $(obj).data('url'),
            data: $('#post_form').serialize(),
            type:'post',
            dataType:'json',
            success:function(res) {
                layer.closeAll();
                if (1 == res.code) {
                    layer.msg(res.msg, {time: 1500}, function() {
                        window.location.href = res.url;
                    });
                } else {
                    layer.msg(res.msg);
                }
            },
            error : function() {
                layer.closeAll();
                layer.alert('未知错误！', {title: false, icon: 5, closeBtn: 0});
            }
        });
    }
</script> 
{eyou:include file="users/users_footer.htm" /} 
<!-- 底部结束 -->